<html>
<head>
        <link rel="stylesheet" type="text/css" href="styles/common.css">
        <script src="js/dom.js"></script>
        <script src="js/ajax.js"></script>
</head>
<body>
<script type="text/javascript">
  function handleSubmit(f) {
        var input = f.elements["file"];
        var file = input.files[0];
          var formData = new FormData();
          formData.append("file", file);
          /*x.send(formData);
          alert('aaa');*/
          ajax({
                url: 'ajax/upload.php',
                method: 'POST',
                data: formData,
                async: true,
                parse_json: true,
                success: function(data) {
                    dom('#uploadprogress').addClass('hidden');
                    dom('#uploadresult').removeClass('hidden');
                    dom('#uploadresult').html('file "' + data.data.filename + '" uploaded<br><a href="#">save and continue</a><br><a href="#" onclick="reload()">upload another file</a>');
                },
                error: function() {
                    dom('#uploadprogress').addClass('hidden');
                    dom('#uploadresult').removeClass('hidden');
                    dom('#uploadresult').html('error');
                }
          });
  }

  function startupload() {
    dom('#uploadprogress').removeClass('hidden');
    dom('#uploader').addClass('hidden');
    handleSubmit(document.getElementById('uploadform'));
  }

  function reload() {
    dom('#uploadprogress').addClass('hidden');
    dom('#uploadresult').addClass('hidden');
    dom('#uploader').removeClass('hidden');
  }

</script>
<div id="uploader">
<form id="uploadform" action="ajax/upload.php" method="POST"
      enctype="multipart/form-data"
      onsubmit="return handleSubmit(this)">
  <input type="file" name="file">
  <a href="#" onclick="startupload();">upload</a>
</form>
</div>
    <div id="uploadprogress" class="loader hidden">
        Progress
    </div>
    <div id="uploadresult" class="hidden">
        Results
    </div>

</body>
</html>